<script setup lang="ts">
import { ElRow, ElCol } from "element-plus";
import { ref, onMounted, onUnmounted, watch } from "vue";
import "codemirror/mode/javascript/javascript.js";
import Codemirror from "codemirror-editor-vue3";
import type { CmComponentRef } from "codemirror-editor-vue3";
import type { Editor, EditorConfiguration } from "codemirror";
import { DocumentEditor } from "@onlyoffice/document-editor-vue";
const demoFileUrl = defineModel('demoFileUrl');
interface Props {
  scriptUrl?: string;
}

defineOptions({
  name: "Frame",
});
</script>

<template>
  <di class="frame_container" ref="containerRef">
    <iframe
      :src="demoFileUrl"
      width="100%"
      height="100%"
      align="top"
      frameborder="0"
      name="frameEditor"
      allowfullscreen=""
      onmousewheel=""
      allow="autoplay; camera; microphone; display-capture; clipboard-write;"
    ></iframe>
  </di>
</template>

<style scoped>
.frame_container {
  width: 100%;
  height: 100%;
  display: inline-block;
}
</style>
